<style lang="less">
@import "../../../assets/style/xinzheng.less";
</style>
<template>
    <div class="xinzheng" ref="validateForm">
        <van-cell-group class="mt10">
        	<!--<van-field
	        	v-model="formItem.defectAddress"
	            center
	            clearable
	            label="隐患地点"
	            required
	            disabled>
	            <van-button slot="button" size="mini" plain type="primary" @click="getAddress">{{address}}</van-button>
	        </van-field>-->
        	<van-field
			    v-model="$route.query.lineName"
			    label="线路名称"
			    placeholder="请输入"
			    autosize
			    disabled
			    required/>
			<van-field
			    v-model="$route.query.towerName"
			    label="运行塔号"
			    placeholder="请输入"
			    autosize
			    disabled
			    required/>
            <van-field
            	class="detail_item"
			    v-model="formItem.qxPosition"
			    label="隐患位置"
			    type="textarea"
			    placeholder="请输入"
			    rows="3"
			    autosize
			    required/>
            <van-field
                v-model="$route.query.cmYhName"
                center
                clearable
                label="隐患类别"
                required
                disabled/>
            
            <van-field
            	class="select_item"
                center
                icon="arrow"
                type="text"
                label="树种"
                placeholder="请选择"
                @click-icon="shuzhongShow = true"
                required
                disabled
                v-model="otherItem.yhDangerName">
            	<!--<van-button @click="shuzhongShow = true" slot="button" size="mini">请选择</van-button>-->
            </van-field>
            <van-popup v-model="shuzhongShow" position="bottom">
		        <van-picker
		          show-toolbar
		          :columns="yhDanger.arr"
		          @change="onChangeYH"
		          @confirm="shuzhongShow = false"
		          @cancel="shuzhongShow = false"/>
		    </van-popup>
            <van-field
                v-model.number="formItem.yhNumber"
                center
                label="数量"
                placeholder="请输入"
                required/>
            <van-field
            	class="detail_item"
			    v-model="formItem.yhDescription"
			    label="隐患描述"
			    type="textarea"
			    placeholder="请输入"
			    rows="4"
			    autosize
			    required/>
            <van-field
                v-model.number="formItem.dbh"
                center
                label="胸径(厘米)"
                placeholder="请输入"
                required/>
            <van-field
                v-model.number="formItem.yhHigh"
                center
                label="树高(米)"
                placeholder="请输入"
                required/>
            <van-field
                v-model.number="formItem.yhClearance"
                center
                label="净空(米)"
                placeholder="请输入"
                required/>
            <van-field
                v-model="formItem.yhOwnerunit"
                center
                label="业主单位"
                placeholder="请输入"
                required/>
            <van-field
                v-model="formItem.yhOwneruser"
                center
                label="业主联系人"
                placeholder="请输入"
                required/>
            <van-field
                v-model="formItem.yhOwnerphone"
                center
                label="联系电话"
                placeholder="请输入"
                required/>
            
            <van-field
            	class="select_item"
            	v-model="formItem.yhSource"
                center
                icon="arrow"
                label="来源"
                placeholder="请选择"
                @click-icon="sourceShow = true"
                required
                disabled>
            </van-field>
            <van-popup v-model="sourceShow" position="bottom">
		        <van-picker
		          show-toolbar
		          :columns="yhSource"
		          value-key='CHARACTERIZATION_NAME'
		          @change="onChangeSource"
		          @confirm="sourceShow = false"
		          @cancel="sourceShow = false"/>
		    </van-popup>  
            
            <!--<van-field
            	class="select_item"
            	v-model="formItem.yhStatusName"
                center
                icon="arrow"
                label="当前状态"
                placeholder="请选择"
                @click-icon="statusShow = true"
                required
                disabled>
            </van-field>
            <van-popup v-model="statusShow" position="bottom">
		        <van-picker
		          show-toolbar
		          :columns="yhStatus"
		          @change="onChangeStatus"
		          @confirm="statusShow = false"
		          @cancel="statusShow = false"/>
		    </van-popup>  -->
		    
            <van-field
            	class="select_item"
            	v-model="formItem.yhRiskLevelName"
                center
                icon="arrow"
                label="风险等级"
                placeholder="请选择"
                @click-icon="levelshow = true"
                required
                disabled>
            </van-field>
            <van-popup v-model="levelshow" position="bottom">
		        <van-picker
		          show-toolbar
		          :columns="yhRiskLevel"
		          @change="onChangeLevel"
		          @confirm="levelshow = false"
		          @cancel="levelshow = false"/>
		    </van-popup>  
		    
            <van-field
            	class="detail_item"
			    v-model="formItem.yhRiskDescription"
			    label="风险描述"
			    type="textarea"
			    placeholder="请输入"
			    rows="4"
			    autosize
			    required/>
            <van-field
                v-model="formItem.yhCurrentMeasures"
                center
                label="当前措施"
                placeholder="请输入"
                required/>
                	<!--隐患照片拍照-->
            <van-cell-group class="mt10">
				<task-photo
	            :photoLists="photoLists1"
	            :photoImg="photoImg"
	             @addPhotos="addPhotos"
	             @deletePhotos="deletePhotos"
	            />
			</van-cell-group>
        </van-cell-group>
        
        <van-cell-group class="mt10">
			<van-field
				class="detail_item"
                clearable
                label="隐患处理方式"
                disabled>
				<van-icon slot="icon" class="slot-cont">
					<span class="left">
						<label for="sfcl" class="check_label">隐患消除</label>
                    	<van-switch v-model="checked2" class="chk_r" size="20px" @change="changeYH"/>
					</span>
				</van-icon>
            </van-field>
		</van-cell-group>
		
		<van-cell-group class="mt10" v-show="checked2">
			<task-photo 
			:photoLists="photoLists2"
            :photoImg="photoImg"
            @addPhotos="addPhotos" 
            @deletePhotos="deletePhotos"
            />
		</van-cell-group>
        <van-button size="large" type="primary" class="upload" @click="upLoad">上传</van-button>
    </div>
</template>

<script>
import {
    Row,
    Col,
    Cell,
    CellGroup,
    Field,
    Button,
    Icon,
    SwitchCell,
    Popup,
    Picker,
    Switch,
    Toast ,
    Dialog
} from 'vant';
import photoImg from '../../../assets/img/changguixunshi/icon_allow.png';
import { callData } from '../../../axios/axios';
import TaskPhoto from '../yinhuan-photo.vue';
import { getLocation } from '../../../api/android';
import AsyncValidator from "async-validator";

const levelMap = {'正常':0, '关注':1, '严重':2}
const statusMap = {'未处理':0, '已受控':1, '已闭环':2}
export default {
    name: 'shuzhangXinZheng',
    components: {
    	TaskPhoto,
        [Cell.name]:Cell,
        [CellGroup.name]: CellGroup,
        [Field.name]: Field,
        [Switch.name]: Switch,
        [Popup.name]: Popup,
        [Picker.name]: Picker,
        [Button.name]: Button,
        [Icon.name]: Icon,
        [SwitchCell.name]: SwitchCell,
        [Toast.name]: Toast
    },
    data() {
        return {
            show:false,
            address: '获取',		//获取地理位置
            defectAddress: '',//地址
            shuzhongShow:false,
            sourceShow:false,
            levelshow:false,
            statusShow:false,
            checked2:false,
            photoImg: photoImg,
            yhRiskLevel:[//0正常/1关注/2严重
            	'请选择','正常','关注','严重'
            ],
            yhStatus:[//0未处理/ 1已受控/ 2已闭环
            	'请选择','未处理','已受控','已闭环'
            ],
            yhSource:[
            	'请选择','遗留','新增'
            ],
            yhDanger:{arr:[], map:{}},//调接口，pid传类别的ID可获取数组
            otherItem:{yhDangerName:''},
            formItem:{
//          	jd:'00.000000',
//          	wd:'00.000000',
//          	defectAddress: '',
            	lineId:'',//线路名称
            	towerId:'',//运行塔号
            	qxPosition:'',//隐患位置
            	yhLb:'',//隐患类别
            	yhNumber:'',//数量
            	yhDescription:'',//隐患描述
            	dbh:'',//胸径(厘米)
            	yhHigh:'',//树高(米)
            	yhClearance:'',//净空(米)
            	yhOwnerunit:'',//业主单位
            	yhOwneruser:'',//业主联系人
            	yhOwnerphone:'',//联系电话
            	yhRiskDescription:'',//风险描述
            	yhCurrentMeasures:'',//当前措施
            	yhRiskLevel:'',//风险等级
            	//yhStatus:'',//当前状态
            	yhSource:'',//来源
            	yhDanger:'',//造成隐患的物体(树种)
            	defectType:2//// 1 消缺 2 新增(进来默认是不选状态即2新增)
            },
            rules: {
//          	defectAddress:{required:true,message:'隐患地点不可为空'},
            	qxPosition:{required:true,message:'隐患位置不可为空'},
            	yhDanger:{required:true,message:'树种不可为空'},
            	yhNumber:[
            		{required:true,message:'数量不可为空'},
            		{type: 'number',message:'数量必须为数字值'}
            	],
            	yhDescription:{required:true,message:'隐患描述不可为空'},
            	dbh:[
            		{required:true,message:'胸径不可为空'},
            		{type: 'number',message:'胸径必须为数字值'}
            	],
            	yhHigh:[
            		{required:true,message:'树高不可为空'},
            		{type: 'number',message:'树高必须为数字值'}
            	],
            	yhClearance:[
            		{required:true,message:'净空不可为空'},
            		{type: 'number',message:'净空必须为数字值'}
            	],
            	yhOwnerunit:{required:true,message:'业主单位不可为空'},
           		yhOwneruser:{required:true,message:'业主联系人不可为空'},
           		yhOwnerphone:[
		            {
		              validator: (rule, value, callback) => {
		                if (!value) {
		                  callback('业主联系人电话不可为空');
		                } else if (/^1(3|4|5|6|7|8|9)\d{9}$/.test(value)) {
		                  callback();
		                } else {
		                  callback('请输入正确的手机号码');
		                }
		              }
		            }
		        ],
           		yhRiskLevel:{required:true,message:'风险等级不可为空'},
//         		yhStatus:{required:true,message:'当前状态不可为空'},
            	yhSource:{required:true,message:'来源不可为空'},
            	yhRiskDescription:{required:true,message:'风险描述不可为空'},
            	yhCurrentMeasures:{required:true,message:'当前措施不可为空'}
           	},
           	photoLists1:[
                {
                    title: "隐患照片",
                    type: 'getPhotosOne',
                    pictureType: 1,
                    photo:[]
                }
            ],
            photoLists2: [
                {
                    title: "隐患处理照片",
                    type: 'getPhotosTwo',
                    pictureType: 0,
                    photo:[]
                }
            ],
            photoImg: photoImg,
            file: {},
        }
    },
    methods: {
		selectStatus() {
			this.show = true
		},
		onChangeYH(picker, value, index) {
			this.formItem.yhDanger = this.yhDanger.map[value]
			this.otherItem.yhDangerName = value
		},
		onChangeSource(picker, value, index) {
			this.formItem.yhSource = value 
		},
		changeYH(value){
			this.formItem.defectType = value?1:2
		},
//	   	onChangeStatus(picker, value, index){
//	   		this.formItem.yhStatus = statusMap[value]
//			this.formItem.yhStatusName = value
//	   	},
	   	onChangeLevel(picker, value, index) {
	   		this.formItem.yhRiskLevel = levelMap[value]
			this.formItem.yhRiskLevelName = value
	   	},
	   	// 获取当前的位置信息
//  	getAddress(){
//  		if(window.Cordova){
//  			getLocation(res => {
//  				this.formItem.defectAddress = res.data.address // 当前的地理位置
//  				this.formItem.jd = res.data.lon  // 经度
//  				this.formItem.wd = res.data.lat  // 纬度 
//  			})
//  		}
//  	},
		//根据不同类别id获取相应的数据
		getYhDanger(){
			var params = {
				pid:this.$route.query.yhId
			}
			let map = {},arr = ['请选择']
			callData('/accountServer/CmYhLb/findCmYhLb', 'get', params).then(data => {
				if(data.data) {
					data.data.forEach((item,index)=>{
						map[item.YH_NAME] = item.ID
						arr.push(item.YH_NAME)
					})
				}
				this.yhDanger.arr = arr
				this.yhDanger.map = map
			})
		},
		addPhotos(file){// 触发子组件的addPhotos方法保存图片信息
    		this.file = {...file, ...this.file}
    	},
    	deletePhotos(index, type) {
    		this.file[type].file.splice(index, 1)
    	},
		// 点击上传按钮 
		upLoad() {
			if (!this.file[this.photoLists1[0].type].file || this.file[this.photoLists1[0].type].file.length==0) {//隐患照片必拍
				Dialog.alert({
					title: '提示',
					message: '请拍照！'
				}).then(() => {
					
				});
				return false;
			}
			if (this.checked2 && this.file[this.photoLists2[0].type].file.length==0) {//处理照片控制
				Dialog.alert({
					title: '提示',
					message: '请拍照！'
				}).then(() => {
					
				});
				return false;
			}
			var validator = new AsyncValidator(this.rules);
			validator.validate(this.formItem,(valid)=>{
				if (!valid) {// 验证通过
					const toast = Toast.loading({
					  duration: 0,       // 持续展示 toast
					  forbidClick: true, // 禁用背景点击
					  mask: true,
					  loadingType: 'spinner',
					  message: '上传中...'
					});
					this.$emit('upLoad', this.formItem, this.file)//把file传到父组件里
				} else {// 验证失败
					Toast.clear();
					Toast.fail(valid[0].message);
				}
			});
		}
    },
    mounted(){
    	this.getYhDanger();
    }
}
</script>
